<!-- $Id: industry_scale_stats.htm 14216 2015-10-26 11:22:21Z langlibin $ -->
{include file="pageheader_bd.htm"}
<script type="text/javascript" src="../js/calendar.php?lang={$cfg_lang}"></script>
<link href="../js/calendar/calendar.css" rel="stylesheet" type="text/css" />
<link href="styles/zTree/zTreeStyle.css" rel="stylesheet" type="text/css" />
<link href="styles/chosen/chosen.css" rel="stylesheet" type="text/css">
{insert_scripts files='jquery-1.6.2.min.js,chosen.jquery.min.js,jquery.ztree.all-3.5.min.js,category_selecter.js'}
<style type="text/css">
#menuContent_cat_id{
    z-index:2;
}
</style>
<div class="tab-div">
  <div id="tabbar-div">
    <p>
        <span class="tab-front" onclick="javascript:location.href='industry_scale_stats.php'">行业规模</span>
        <span class="tab-back" onclick="javascript:location.href='industry_best_goods_stats.php'">行业排行</span>
    </p>
  </div>
  <div id="tabbody-div">
    <p style="margin: 10px">统计某行业子分类在不同时间段的下单金额、下单商品数、下单量，为分析行业销量提供依据</p>
  </div>
</div>
<div class="form-div">
    <form action="industry_scale_stats.php" method="post" id="searchForm" name="searchForm">
        商品分类：
        <input type="text" id="cat_name" name="cat_name" nowvalue="{$goods_cat_name}" value="{$goods_cat_name}" >
        <input type="hidden" id="cat_id" name="cat_id" value="{$goods_cat_id}">
        <select name="stats_type" id="stats_type" onchange="week()">
            <option value="0" {if $stats_type eq '0'}selected{/if}>按日统计</option>
            <option value="1" {if $stats_type eq '1'}selected{/if}>按周统计</option>
            <option value="2" {if $stats_type eq '2'}selected{/if}>按月统计</option>
        </select>
        <input name="date" id="date" value="{$date}" style="width:100px;height:20px;" onclick="return showCalendar(this, '%Y-%m-%d', false, false, this);" />
        <select name="year" id="year" onchange="week()"></select>
        <select name="month" id="month" onchange="week()"></select>
        <select name="dropweek" id="dropweek" {if $stats_type neq '1'}style="display: none"{/if}></select>
        &nbsp;&nbsp;&nbsp;&nbsp;<input type="submit" name="submit" value="{$lang.query}" class="button" />
    </form>
</div>
<div class="tab-div">
  <div id="tabbar-div2">
    <p>
        <span class="tab-front" id="order_tab_1">下单金额</span>
        <span class="tab-back" id="order_tab_2">下单商品数</span>
        <span class="tab-back" id="order_tab_3">下单量</span>
    </p>
  </div>
  <div id="tabbody-div">
    <div class="list-div" id="order_list_1">
        <div class="order_count order_count_spe">
            <p><span class="tab_front">行业下单金额统计</span></p>
            <div style='height:400px;width:90%;margin-left:auto;margin-right:auto;' id='orders_option_div_1'></div>
        </div>
    </div>
    <div class="list-div" id="order_list_2">
        <div class="order_count order_count_spe">
            <p><span class="tab_front">行业下单商品数统计</span></p>
            <div style='height:400px;width:90%;margin-left:auto;margin-right:auto;' id='orders_option_div_2'></div>
        </div>
    </div>
    <div class="list-div" id="order_list_3">
        <div class="order_count order_count_spe">
            <p><span class="tab_front">行业下单量统计</span></p>
            <div style='height:400px;width:90%;margin-left:auto;margin-right:auto;' id='orders_option_div_3'></div>
        </div>
    </div>
  </div>
</div>
<script type="text/javascript" language="JavaScript">
    var date = new Date();
    var y = date.getFullYear();
    var m = date.getMonth() + 1;

    for (i = 0; i < 10; i++) {
        var oP = document.createElement("option");
        var oText = document.createTextNode(y);
        oP.appendChild(oText);
        oP.setAttribute("value", y);
        if(y == '{$year}')
        {
            oP.setAttribute("selected", "selected")
        }
        document.getElementById('year').appendChild(oP);
        y = y - 1;
    };
    var j = 1;
    for (i = 1; i < 13; i++) {
        var month = document.createElement("option");
        var monthText = document.createTextNode(j);
        month.appendChild(monthText);
        month.setAttribute("value", j);
        if (j == {$month})
        {
            month.setAttribute("selected", "selected");
        }
        document.getElementById('month').appendChild(month);
        j = j + 1;
    };

    var week_num = {$week_num};
    //绑定周
    function week()
    {
        if($("#stats_type").val()==0)
        {
            $("#date").show();
            $("#year").hide();
            $("#month").hide();
            $("#dropweek").hide();
            return;
        }
        else if($("#stats_type").val()==2)
        {
            $("#date").hide();
            $("#year").show();
            $("#month").show();
            $("#dropweek").hide();
            return;
        }
        $("#date").hide();
        $("#year").show();
        $("#month").show();
        $("#dropweek").show();
        var text = $("#year").val() + '-' + $("#month").val();
        var ymd = text.substring(0, 4) + "-" + text.substring(5, 7) + "-1";
        var week = new Date(Date.parse(ymd.replace(/\-/g, "/")));
        var w = week.toString().substring(0, 3);
        var yymm = new Date(text.substring(0, 4), text.substring(5, 7), 0);
        var day = yymm.getDate();
        var dd = 1;
        switch (w) {
            case "Mon": dd = 0; break;
            case "Tue": dd = 1; break;
            case "Wed": dd = 2; break;
            case "Thu": dd = 3; break;
            case "Fri": dd = 4; break;
            case "Sat": dd = 5; break;
            case "Sun": dd = 6; break;
        }
        var aw = 5;
        if (day == 28 && dd == 0) {
            aw = 4;
        }
        var i = 1;
        $("#dropweek").empty();
        for (var i = 0; i < aw; i++) {
            var start = i * 7 + 1 - dd;
            var end = i * 7 + 7 - dd;
            if (start < 1) {
                start = 1;
            }
            if (end > day) {
                end = day;
            }
            var str = ("第" + (i + 1) + "周 <" + text.substring(5, 7) + "月" + start + "号—" + text.substring(5, 7) + "月" + end + "号>").toString();
            var val = $("#year").val() + '-' + text.substring(5, 7) + '-' + start + ' ' + $("#year").val() + '-' + text.substring(5, 7) + '-' + end + ' ' + i;
            $("#dropweek").append("<option value='" + val + "'>" + str + "</option>");
        }
        $('#dropweek')[0].selectedIndex = week_num;

        var itme = $("#dropweek").find("option:selected").text();
        $("#txtweek:text").val(itme.toString());
    }
    // 执行
    week();

    $(document).ready(function(){
        $("#order_list_2").hide();
        $("#order_list_3").hide();
        $("#order_tab_1").hover(function(){
            $("#order_list_1").show();
            $("#order_list_2").hide();
            $("#order_list_3").hide();
            $("#order_tab_1").addClass('tab-front');
            $("#order_tab_1").removeClass('tab-back');
            $("#order_tab_2").addClass('tab-back');
            $("#order_tab_2").removeClass('tab-front');
            $("#order_tab_3").addClass('tab-back');
            $("#order_tab_3").removeClass('tab-front');
        });
        $("#order_tab_2").hover(function(){
            $("#order_list_1").hide();
            $("#order_list_2").show();
            $("#order_list_3").hide();
            $("#order_tab_1").addClass('tab-back');
            $("#order_tab_1").removeClass('tab-front');
            $("#order_tab_2").addClass('tab-front');
            $("#order_tab_2").removeClass('tab-back');
            $("#order_tab_3").addClass('tab-back');
            $("#order_tab_3").removeClass('tab-front');
        });
        $("#order_tab_3").hover(function(){
            $("#order_list_1").hide();
            $("#order_list_2").hide();
            $("#order_list_3").show();
            $("#order_tab_1").addClass('tab-back');
            $("#order_tab_1").removeClass('tab-front');
            $("#order_tab_2").addClass('tab-back');
            $("#order_tab_2").removeClass('tab-front');
            $("#order_tab_3").addClass('tab-front');
            $("#order_tab_3").removeClass('tab-back');
        });
    });
    $().ready(function(){
        // $("#cat_name")为获取分类名称的jQuery对象，可根据实际情况修改
        // $("#cat_id")为获取分类ID的jQuery对象，可根据实际情况修改
        // "{$goods_cat_id}"为被选中的商品分类编号，无则设置为null或者不写此参数或者为空字符串
        $.ajaxCategorySelecter($("#cat_name"), $("#cat_id"), "{$goods_cat_id}");
    });
</script>
<script src='js/echarts-all.js'></script>
<script>
    var option1 = {
        title : {
        },
        tooltip : {
            trigger: 'axis'
        },
        legend: {
            data:[]
        },
        toolbox: {
            show : true,
            feature : {
                mark : {show: false},
                dataView : {show: false, readOnly: false},
                magicType: {show: true, type: ['bar']},
                restore : {show: true},
                saveAsImage : {show: true}
            }
        },
        calculable : true,
        xAxis : [
            {
                type : 'value',
                boundaryGap : [0, 0.01]
            }
        ],
        yAxis : [
            {
                type : 'category',
                data : [{$cat_name_arr}]
            }
        ],
        series : [
            {
                type:'bar',
                data:[{$goods_price_arr}]
            }
        ]
    };
    var option2 = {
        title : {
        },
        tooltip : {
            trigger: 'axis'
        },
        legend: {
            data:[]
        },
        toolbox: {
            show : true,
            feature : {
                mark : {show: false},
                dataView : {show: false, readOnly: false},
                magicType: {show: true, type: ['bar']},
                restore : {show: true},
                saveAsImage : {show: true}
            }
        },
        calculable : true,
        xAxis : [
            {
                type : 'value',
                boundaryGap : [0, 0.01]
            }
        ],
        yAxis : [
            {
                type : 'category',
                data : [{$cat_name_arr}]
            }
        ],
        series : [
            {
                type:'bar',
                data:[{$goods_count_arr}]
            }
        ]
    };
    var option3 = {
        title : {
        },
        tooltip : {
            trigger: 'axis'
        },
        legend: {
            data:[]
        },
        toolbox: {
            show : true,
            feature : {
                mark : {show: false},
                dataView : {show: false, readOnly: false},
                magicType: {show: true, type: ['bar']},
                restore : {show: true},
                saveAsImage : {show: true}
            }
        },
        calculable : true,
        xAxis : [
            {
                type : 'value',
                boundaryGap : [0, 0.01]
            }
        ],
        yAxis : [
            {
                type : 'category',
                data : [{$cat_name_arr}]
            }
        ],
        series : [
            {
                type:'bar',
                data:[{$orders_count_arr}]
            }
        ]
    };
    var order_chart1 = echarts.init(document.getElementById('orders_option_div_1'));
    order_chart1.setOption(option1);
    var order_chart2 = echarts.init(document.getElementById('orders_option_div_2'));
    order_chart2.setOption(option2);
    var order_chart3 = echarts.init(document.getElementById('orders_option_div_3'));
    order_chart3.setOption(option3);
</script>
{include file="pagefooter.htm"}